{extend name="main/index" /}
{block name="main"}
<div class="content-page">
    <!-- ============================================================== -->
    <!-- Start Content here -->
    <!-- ============================================================== -->
    <div class="content">

        <div class="row">
            <div class="col-md-12">
                <div class="widget">
                    <div class="widget-header transparent">
                        <h2><strong>商户</strong></h2>
                        <div class="additional-btn">
                            <a href="#" class="hidden reload"><i class="icon-ccw-1"></i></a>
                            <a href="#" class="widget-toggle"><i class="icon-down-open-2"></i></a>
                            <a href="#" class="widget-close"><i class="icon-cancel-3"></i></a>
                        </div>
                    </div>
                    <div class="widget-content">
                        <div class="table-responsive">
                            <table data-sortable class="table table-hover table-striped">
                                <thead>
                                <tr>
                                    <button data-modal="md-fade-in-scale-up" class="btn btn-info btn-sm md-trigger add-btn">添加店铺</button>
                                    <th>ID</th>
                                    <th>店名</th>
                                    <th>电话</th>
                                    <th>地址</th>
                                    <th>状态</th>
                                    <th>商铺</th>
                                    <th data-sortable="false">操作</th>
                                </tr>
                                </thead>

                                <tbody>
                                {volist name="yshop" id="vo"}
                                <tr>
                                    <td>{$vo.id}</td>
                                    <td>{$vo.name}</td>
                                    <td>{$vo.tel}</td>
                                    <td>{$vo.address}</td>
                                    {if $vo.status == 1}
                                    <td><button class="btn btn-success update" data-id="{$vo.id}">启用</button></td>
                                    {else $vo.status == 2}
                                    <td><button class="btn btn-danger update" data-id="{$vo.id}">禁用</button></td>
                                    {/if}
                                    <td><a class = "md-trigger btn btn-info at-btn" data-modal = "md-rotate-from-left" href="{:url('home/Comment/at',['id' => $vo['id']])}">商铺属性</a>
                                        <a class = "md-trigger btn btn-info at-btn" data-modal = "md-rotate-from-left" href="{:url('home/Comment/menu',['id' => $vo['id']])}">商铺菜单</a></td>
                                    <td> <button data-modal="md-fall" class="btn btn-success show-btn  md-trigger" data-id="{$vo.id}">详细信息</button> <button data-modal="md-3d-flip-horizontal" class="btn btn-primary md-trigger edit-btn" data-id="{$vo.id}">修改</button> <button class="btn btn-danger del-btn" data-id="{$vo.id}">删除</button>
                                        <a href="{:url('home/banner/index',['id' => $vo['id']])}" class="btn btn-info" >图片管理</a> <a href="{:url('home/banner/read',['id' => $vo['id']])}"  class="btn btn-info" >上传</a> <a href="{:url('home/banner/create',['id' => $vo['id']])}"  class="btn btn-info" >上传环境</a> <a href="{:url('home/Comment/index',['id' => $vo['id']])}"  class="btn btn-info" >商铺介绍</a></td>
                                </tr>
                                {/volist}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

        </div>

        <!-- Footer End -->
    </div>
    <!-- ============================================================== -->
    <!-- End content here -->
    <!-- ============================================================== -->
</div>


<!--详细信息模态框-->
<div class="md-modal md-fall" id="md-fall">
    <div class="md-content">
        <button class="btn btn-danger md-close">关闭</button>
            <table data-sortable class="table table-hover table-striped">
                <thead>
                    <h3 id="h" style="color: red"></h3>
                </thead>
                <tr>
                    <th class="col-md-1">电话:</th>
                    <td id="s1"></td>
                </tr>
                <tr>
                    <th class="col-md-1">地址:</th>
                    <td id="s2"></td>
                </tr>
                <tr>
                    <th class="col-md-1">Time:</th>
                    <td id="s3"></td>
                </tr>
                <tr>
                    <th class="col-md-1">商圈:</th>
                    <td id="s4"></td>
                </tr>
        </table>
    </div><!-- End div .md-content -->
</div><!-- End div .md-modal .md-fall -->

<!-- 新增店铺模态框 -->
<div class="md-modal md-fade-in-scale-up" id="md-fade-in-scale-up">
    <p>
        <button class="btn btn-danger md-close">关闭</button>
    </p>
    <div class="md-content">
        <h3>添加店铺</h3>
        <div class="widget-content padding">
            <form class="form-horizontal" role="form" action="{:url('home/ycompany/save')}" method="post">
                <div class="form-group">
                    <label for="input-text-help" class="col-sm-2 control-label">分类选择</label>
                    <div class="col-sm-10">
                        <select class="form-control cate-top"></select>
                        <select class="form-control cate-son" name="gid"></select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="input-text-help" class="col-sm-2 control-label">店铺名</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="input-text-help" placeholder="商户名" name="name" value="">
                    </div>
                </div>
                <div class="form-group">
                    <label for="input-text-help" class="col-sm-2 control-label">电话</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="input-text-help" placeholder="电话" name="tel" value="">
                    </div>
                </div>
                <div class="form-group">
                    <label for="input-text-help" class="col-sm-2 control-label">地址</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="input-text-help" placeholder="地址" name="address" value="">
                    </div>
                </div>
                <div class="form-group">
                    <label for="input-text-help" class="col-sm-2 control-label">营业时间</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="input-text-help" placeholder="营业时间" name="datetime" value="">
                    </div>
                </div>
                <div class="form-group">
                    <label for="input-text-help" class="col-sm-2 control-label">区域</label>
                    <div class="col-sm-10">
                        <select class="form-control" name="area">
                            <option>黄浦区</option>
                            <option>静安区</option>
                            <option>徐汇区</option>
                            <option>长宁区</option>
                            <option>普陀区</option>
                            <option>虹口区</option>
                            <option>杨浦区</option>
                            <option>宝山区</option>
                            <option>闵行区</option>
                            <option>嘉定区</option>
                            <option>浦东新区</option>
                            <option>金山区</option>
                            <option>松江区</option>
                            <option>青浦区</option>
                            <option>奉贤区</option>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">状态</label>
                    <div class="col-sm-10">
                        <div class="radio iradio">
                            <label>
                                <input type="radio" name="status" id="optionsRadios1" value="1">启用
                                <input type="radio" name="status" id="optionsRadios2" value="2" checked>禁用
                            </label>
                        </div>
                    </div>
                </div>
                <button type="submit" class="btn btn-info">提交</button>
            </form>
        </div>
    </div><!-- End div .md-content -->
</div><!-- 新增店铺 end -->

<!--编辑模态框-->
<div class="md-modal md-3d-flip-horizontal" id="md-3d-flip-horizontal">
    <div class="md-content">
        <div>
            <div class="widget-content padding">
                <h3> <button class="btn btn-danger md-close">关闭</button></h3>
                <form class="form-horizontal" role="form" action="{:url('home/ycompany/update')}" method="post">
                    <input type="hidden" name="id" id="id" value="">
                    <input type="hidden" name="_method" value="PUT">
                    <div class="form-group">
                        <label for="input-text-help" class="col-sm-2 control-label">分店名</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control name" id="input-text-help" placeholder="分店名" name="name" value="">

                        </div>
                    </div>
                    <div class="form-group">
                        <label for="input-text-help" class="col-sm-2 control-label">电话</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control tel" id="input-text-help" placeholder="电话" name="tel" value="">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="input-text-help" class="col-sm-2 control-label">地址</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control address" id="input-text-help" placeholder="地址" name="address" value="">
                        </div>
                    </div>


                    <div class="form-group">
                        <label class="col-sm-2 control-label"></label>
                        <div class="col-sm-10">
                            <button type="submit" class="btn btn-default">Submit</button>
                        </div>
                    </div>
                </form>
            </div>

        </div>

    </div><!-- End div .md-content -->
</div>
<!--编辑模态框 end-->
{js href="/static/home/js/jquery.min.js"}
{js href="/static/home/js/bootstrap.js"}
{js href="/static/home/js/toastr.min.js"}
<script>


//执行AJAX,取一级分类;
$(function() {
  $('.add-btn').click(function(){
        var obj = $(this);
        cateAjax(obj);
  });

    function cateAjax(obj) {
        $.ajax({
            type: 'get',
            url: '/getCate/',
            dataType : 'json',
            success : function (data){
                // console.log(data);
                for (var i = 0; i < data.length; i++) {
                    $('<option value="'+data[i].id+'">'+data[i].name+'</option>').appendTo('.cate-top');
                }
            },
            error : function () {
                alert('AJAX执行失败!');
            }
        });
    }
});

$(function(){
     // 绑定change事件,获取二级分类
    $('.cate-top').change(function(){
        // 清空之后所有的option选项
        $(this).nextAll('select').show().empty();
        // 获取当前的value值
        var pid = $(this).val();
        // console.log('id:'+pid);
        var _this = $(this);
        // console.log(_this);

        // 请求下一级数据
        $.ajax({
            type: 'get',
            url: '/getCates/',
            data:'pid='+pid,
            dataType: 'json',
            success : function (data) {
                console.log(data);

                if (!data) {
                    _this.nextAll('select').hide();
                    return;
                }

                // 填充下一级数据
                for (var i = 0; i < data.length; i++) {
                    $('<option value="'+data[i].id+'">'+data[i].name+'</option>').appendTo('.cate-son');
                }
            },
            error : function () {
                alert('AJAX执行失败');
            }
        });//ajax end
    });
});
    

    //删除数据
    $(function(){
        $('.del-btn').click(function(){
            var de_id = $(this).attr('data-id');
            var obj = $(this).parents('tr');
//            console.log(de_id,obj);
            delAjax(de_id,obj);
        });
//        详细信息
        $('.show-btn').click(function(){
            var sh_id = $(this).attr('data-id');
            showAjax(sh_id);
        });
//        更新状态
        $('.update').click(function(){
            var uid = $(this).attr('data-id');
            var obj = $(this);
            updateSave(uid,obj);
        });
    });
    //    详细信息
    function showAjax(id){
    $.ajax({
        type: 'post',
        url: '/show/',
        data: {id:id},
        success : function(data){
            console.log(data);
            if(data.status){
                toastr.success(data.info);
                $('#h').html(data.datas.name);
                $('#s1').html(data.datas.tel);
                $('#s2').html(data.datas.address);
                $('#s3').html(data.datas.datetime);
                $('#s4').html(data.datas.area);

            }else{
                toastr.error(data.info);
            }
        },
        error :function(){
            alert('执行失败');
        }
    });
}
//    更改状态
function updateSave(uid,obj)
{
    $.ajax({
        type : 'post',
        url : '/up/',
        data : {uid : uid},
        dataType : 'json',
        success : function(data){
            console.log(data);
            if(data.status == 1){
                toastr.success(data.info);
                obj.removeClass('btn-danger').addClass('btn-success');
                obj.html('启用');
            }else{
                toastr.success(data.info);
                obj.removeClass('btn-success').addClass('btn-danger');
                obj.html('禁用');
            }
        },
        error:function(){
            alert('更新失败');
        }
    });
}

$(function () {
    $('.edit-btn').click(function(){
        var ed_id = $(this).attr('data-id');
        console.log(id);
        editAjax(ed_id);
    });
});
function editAjax(id)
{
    $.ajax({
        type: 'post',
        url: '/edit/',
        data:{id: id},
        dataType : 'json',
        success : function(data){
            console.log(data);
            if (data.status){
                toastr.success(data.info);
                $('#id').val(data.data.id);
                $('.username').val(data.data.username);
                $('.name').val(data.data.name);
                $('.tel').val(data.data.tel);
                $('.address').val(data.data.address);
            }else {
                toastr.error(data.info);
            }
        },
        error : function(){
            alert('执行失败');
        }
    });
}
//    删除
function  delAjax(id,obj) {
    $.ajax({
        type : 'delete',
        url :'/home/ycompany/'+id,
        dataType : 'json',
        success:function(data){
            if(data.status){
                toastr.success(data.info);
                obj.remove();
            }else{
                toastr.error(data.info);
            }

        },
        error :function(){
            alert('失败');
        }
    });
}
</script>
{/block}